<template>
  <t-dialog  v-if="isDialog" :header="`${header}-审批记录`" :visible.sync="visible" :onClose="closeDialog"     :closeOnOverlayClick="false"
            :confirmBtn="null" width="80%"
            top="5%">
    <div style="height: 65vh">
      <t-table
        rowKey="id"
        :data="data"
        :columns="columns"
        hover
        :loading="dataLoading"
      >
        <template #approveType="{row}">
          {{ row.approveType|filterByDict(dict.type.cgzh_approve_type) }}
        </template>
        <template #approveStatus="{row}">
          <t-tag v-if="row.approveStatus"
                 :theme="handleTheme(row.approveStatus, dict.type.approve_status )" variant="light">
            {{ row.approveStatus | filterByDict(dict.type.approve_status ) }}
          </t-tag>
          <t-tag v-else theme="warning" variant="light">待审批
          </t-tag>
        </template>
      </t-table>
    </div>
  </t-dialog>
  <div v-else>
    <t-table
      rowKey="id"
      :data="data"
      :columns="columns"
      hover
      :loading="dataLoading"
    >
      <template #approveType="{row}">
        {{ row.approveType|filterByDict(dict.type.cgzh_approve_type) }}
      </template>
      <template #approveStatus="{row}">
        <t-tag v-if="row.approveStatus"
               :theme="handleTheme(row.approveStatus, dict.type.approve_status )" variant="light">
          {{ row.approveStatus | filterByDict(dict.type.approve_status ) }}
        </t-tag>
        <t-tag v-else theme="warning" variant="light">待审批
        </t-tag>
      </template>
    </t-table>
  </div>
</template>

<script>


export default {
  name: "approve-list",
  dicts:['cgzh_approve_type', 'approve_status'],
  components:{
  },
  props: {
    objId: [String, Number],
    // header: String,
    isDialog: {
      type: Boolean,
      default: true
    },
    header: {
      type: String,
    },
    projectName: {
      type: String,
    },
  },
  data(){
    return {
      tabValue:"1",
      dialog:{
        objId:0,
        teamId:0,
        open:false,
        reviewType: null,
      },
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        approveType: '',
        businessName: '',
      },
      visible: true,
      data: [],
      columns: [
        // {
        //   colKey: "businessId",
        //   title: "业务id",
        //   align: "center"
        // },
        {
          colKey: "businessName",
          title: "业务名称",
          align: "center",
          ellipsis: true
        },
        {
          colKey: "approveType",
          title: "审批业务类型",
          align: "center",
          ellipsis: true
        },
        {
          colKey: "approverName",
          title: "审批人",
          align: "center",
          ellipsis: true
        },
        {
          colKey: "deptName",
          title: "单位",
          align: "center",
          ellipsis: true
        },
        {
          colKey: "opinion",
          title: "审批意见",
          align: "center",
          width: 300
          // ellipsis: true
        },
        {
          colKey: "approveStatus",
          title: "审批结果",
          align: "center",
          ellipsis: true
        },
        {
          colKey: "updateTime",
          title: "审批时间",
          align: "center",
          width: 200
        },
      ],
      dataLoading: false,
    }
  },
  created() {
    this.getList();
  },
  methods:{
    getList() {
      this.dataLoading = true;
      this.$api.cgzh.approve.getByBusinessId(this.objId).then(response => {
        this.data = response.data;
        this.dataLoading = false;
        // this.formData.id = this.row.id;
        // this.formData.businessId = this.row.businessId;
        // this.formData.approveType = this.row.approveType;
      }).catch((e) => {
        this.dataLoading = false;
        this.$message.error(e.toString());
      });
    },
    closeDialog() {
      this.$emit("update:visible", false);
    },
  }
}
</script>

<style lang="less" scoped>
.t-tab-panel{
  padding: 10px;
}
</style>
